<!--
 * @Descripttion: 
 * @Author: zhanyi
 * @Date: 2021-10-26 20:49:43
 * @FilePath: \wczd-mobile\src\pages\danger\danger.vue
-->
<template>
  <div class="danger">
    <div class="globalTitle">
      <div class="title">隐患治理</div>
      <div class="select">
        <div :class="nowDangerType.value===item.value?'selected':'select-item'" v-for="(item,index) in _selectData" :key="index" @click="_selectClick(item)">
          {{ item.name }}
        </div>
      </div>
    </div>
    <div class="showCont" v-if="nowDangerType">
      <dangerFind ref="dangerFind" v-if="nowDangerType.value==='由我发现'"></dangerFind>
      <dangerManager ref="dangerManager" v-if="nowDangerType.value==='隐患处置'"></dangerManager>
      <dangerModify ref="dangerModify" v-if="nowDangerType.value==='由我整改'"></dangerModify>
      <dangerCheck ref="dangerCheck" v-if="nowDangerType.value==='由我核验'"></dangerCheck>
      <dangerLoop ref="dangerLoop" v-if="nowDangerType.value==='隐患闭环'"></dangerLoop>
    </div>
  </div>
</template>

<script>
import { getRouters } from '@/api/danger'
import { mapGetters } from 'vuex'
import dangerFind from "./danger-find.vue";
import dangerManager from "./danger-manager.vue";
import dangerModify from "./danger-modify.vue";
import dangerCheck from "./danger-check.vue";
import dangerLoop from "./danger-loop.vue";

export default {
  name: 'danger',
  components: { dangerFind, dangerManager, dangerModify, dangerCheck, dangerLoop },
  data () {
    return {
      selectData: [
        { name: '由我发现', value: '由我发现', component: '' },
        { name: '隐患处置', value: '隐患处置', component: 'inspection/whDangerInfo/index' },
        { name: '由我整改', value: '由我整改', component: '' },
        { name: '由我核验', value: '由我核验', component: '' },
        { name: '隐患闭环', value: '隐患闭环', component: 'inspection/whDangerHis/index' }
      ],
      reFresh: '',
      allowRouters: ['']
    }
  },
  computed: {
    _selectData () {
      let foo = []
      for (const iterator of this.selectData) {
        if (this.allowRouters.includes(iterator.component)) {
          foo.push(iterator)
        }
      }
      this.$store.dispatch('changeNowDangerType', foo[0])
      return foo
    },
    ...mapGetters(['nowDangerType']),
  },
  onLoad () {
    this._getRouters()
  },
  onShow () {
    setTimeout(() => {
      if (this.nowDangerType) {
        if (this.nowDangerType.value === '由我核验')
          this.$refs.dangerCheck.reload()
        if (this.nowDangerType.value === '隐患处置')
          this.$refs.dangerManager.reload()
        if (this.nowDangerType.value === '由我整改')
          this.$refs.dangerModify.reload()
        if (this.nowDangerType.value === '由我发现') {
          this.$refs.dangerFind.reload()
        }
      }
    }, 1);
  },
  methods: {
    // 路由权限
    _getRouters () {
      getRouters().then(res => {
        if (res?.data) {
          for (const iterator of res?.data) {
            if (iterator.name === 'Prevention') {
              for (const iterator1 of iterator.children) {
                if (iterator1.name === 'Danger') {
                  iterator1.children.forEach(element => {
                    this.allowRouters.push(element.component)
                  });
                }
              }
            }
          }
        }
      })
    },
    // 全局提交状态
    _selectClick (item) {
      this.$store.dispatch('changeNowDangerType', item)
    }
  },
}
</script>

<style scoped lang="scss">
.globalTitle {
  ::-webkit-scrollbar {
    height: 0px;
  }
}

.danger {
  height: 100%;
  display: flex;
  flex-direction: column;
  .showCont {
    flex: 1;
    overflow: auto;
    // text-align: center;
  }
}
</style>
